<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=1000, initial-scale=1.0, maximum-scale=1.0">
	    <include file='__VIEW__/Common/header' />
	    <!--上传插件uploadify的文件-->
		<script type="text/javascript" src="__STATIC__/uploadify/jquery-1.8.2.min.js"></script>
		<script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
		<link href="__STATIC__/uploadify/uploadify.css" type="text/css" rel="stylesheet"></link>
		<script type="text/javascript">
			//让上传按钮显示
			function uploadifyShow(){
        			 $('#file').uploadify({
                    'formData'     : {//POST数据
                        '<?php echo session_name();?>' : '<?php echo session_id();?>',
                    },
                    'fileTypeDesc' : '上传文件',//上传描述
                    'fileTypeExts' : '*.jpg;*.png;*.gif',
                    'swf'      : '__STATIC__/uploadify/uploadify.swf',
                    'uploader' : '{|U:"upload"}',
                    'buttonText':'选择文件',
                    'fileSizeLimit' : '2000KB',
                    'uploadLimit' : 1,//上传文件数
                    'width':65,
                    'height':25,
                    'multi': false,//是否多文件上传
                    'successTimeout':10,//等待服务器响应时间
                    'removeTimeout' : 0.2,//成功显示时间
                    'onUploadSuccess' : function(file, data, response) {
                    	//把变量转为json
                        data=$.parseJSON(data);
                        var li="<li path='"+data.path+"' url='"+data.url+"'><img src='"+data.url+"' style='width:200px;' class='img-thumbnail'/><a href='javascript:;' class='removeImg'>X</a><input type='hidden' name='logo' value='"+data.path+"' /></li>";
                        $("#uploadList ul").prepend(li);
                        //让删除按钮消失
                        $('.uplodify-box').html('');
                    }
                });
	        }
            $(function(){
            	//刷新页面让上传插件显示
            	uploadifyShow();
            	//点击x，隐藏图片，并且上传按钮显示
	  			$('.removeImg').live('click',function(){
	  				//获得当前图片的所在的li，让其消失
	  				$(this).parent('li').parent('ul').html("");
	  				//上传按钮显示
	  				$('.uplodify-box').html('<input id="file" type="file" multiple="false"><span>类型: *.jpg,*.png 大小: 2000KB 数量: 10</span>');
	  				uploadifyShow();
	  			})
            });
        </script>
        <style type="text/css">
	    ul li{list-style: none;}
	    #uploadList li{position: relative;}
	    a.removeImg{position: absolute;top: -10px;left: 190px;display: block;width: 20px;height: 20px;background: #FF0000;color: #FFF;border-radius: 50%;text-align: center;line-height: 20px;}
	    </style>
	</head>
	<body>
		<form action="" method="post">
			<div class="alert alert-success">添加品牌</div>
			<div class="form-group">
				<label for="exampleInputEmail1">品牌名称</label>
				<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入品牌名称" required="" name="bname">
			</div>
			<div class="form-group">
				<label for="exampleInputEmail1">品牌logo</label>
				<div lab="uploadFile">
				  	<!--这个div是放上传按钮的-->
				  	<div class="uplodify-box">
					  	<input id="file" type="file" multiple="false">
			            <span>类型: *.jpg,*.png,*.gif 大小: 2000KB 数量: 1</span>
				  	</div>
		            <div id="uploadList">
		                <ul>
		                </ul>
		            </div>
	        	</div>
			</div>
			<div class="form-group">
				<label for="exampleInputEmail1">品牌排序</label>
				<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入品牌排序" required="" name="bsort" value="100">
			</div>
			<div class="form-group">
				<label for="exampleInputEmail1">是否热门</label>
				<br />
				<label class="radio radio-inline" for="radio5">
					<input id="radio5" class="custom-radio" type="radio" data-toggle="radio" value="1" name="ishot">
					<span class="icons">
					<span class="icon-unchecked"> </span>
					<span class="icon-checked"> </span>
					</span>
					是
				</label>
				<label class="radio  radio-inline" for="radio6">
					<input id="radio6" class="custom-radio" type="radio" data-toggle="radio" checked="checked" value="0" name="ishot">
					<span class="icons">
					<span class="icon-unchecked"></span>
					<span class="icon-checked"></span>
					</span>
					否
				</label>
			</div>
			<button class="btn btn-primary btn-block" type="submit">添加品牌</button>
		</form>
	</body>
</html>
